<template>
	<Page class="visit-form">
		<div class="question">
			<div class="question-title">
				<img class="visit-top-title1" src="~img/questionnaire/bac-title.png" alt="" />
				<div class="visit-top-title2">参与问卷小调查，为您提供更优质的服务!</div>
			</div>
			<!-- 基本信息 -->
			<div class="qs-company">
				<div class="oneline_left">
					<p>{{ shortName }}</p>
				</div>
				<div>
					<div class="title-com">{{ corpName }}</div>
					<div class="title-cre">统一信用代码：{{ corpCredit }}</div>
				</div>
			</div>
			<!-- 问卷内容 -->
			<div class="question-item">
				<div class="question-item-title">
					<span class="question-index">01.</span
					><span class="question-tip">【填写】</span>企业联系人姓名:
				</div>
				<input v-model="answers1.q1" placeholder="请输入姓名" :disabled="inputDisabled" />
			</div>
			<div class="question-item">
				<div class="question-item-title">
					<span class="question-index">02.</span
					><span class="question-tip">【填写】</span>企业联系人手机号:
				</div>
				<input
					v-model="answers2.q2"
					placeholder="请输入手机号"
					inputmode="numeric"
					:disabled="inputDisabled"
					pattern="[0-9]*"
				/>
			</div>
			<div class="question-item">
				<div class="question-item-title">
					<span>03.</span><span class="question-tip">【填写】</span>企业实际经营地址:
				</div>
				<input v-model="answers3.q3" placeholder="请输入实际经营地址" :disabled="inputDisabled" />
			</div>
			<div class="question-item">
				<div class="question-item-title">
					<span class="question-index">04.</span
					><span class="question-tip">【单选】</span>企业目前有无贷款需求:
				</div>
				<van-radio-group v-model="answers4.q4">
					<div class="question-ans">
						<van-radio icon-size="16px" name="A" :disabled="inputDisabled">A、50万以下</van-radio>
					</div>
					<div class="question-ans">
						<van-radio icon-size="16px" name="B" :disabled="inputDisabled">B、50-100万</van-radio>
					</div>
					<div class="question-ans">
						<van-radio icon-size="16px" name="C" :disabled="inputDisabled">C、100-200万</van-radio>
					</div>
					<div class="question-ans">
						<van-radio icon-size="16px" name="D" :disabled="inputDisabled">D、200-500万</van-radio>
					</div>
					<div class="question-ans">
						<van-radio icon-size="16px" name="E" :disabled="inputDisabled">E、500万以上</van-radio>
					</div>
					<div class="question-ans">
						<van-radio icon-size="16px" name="F" :disabled="inputDisabled">F、无贷款需求</van-radio>
					</div>
				</van-radio-group>
			</div>
			<div class="question-item" v-if="answers4.q4 !== 'F'">
				<div class="question-item-title">
					<span class="question-index">05.</span
					><span class="question-tip">【多选】</span>如果企业出现资金紧张的主要原因是:
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers5.q5_a"
						:disabled="inputDisabled"
					>
						A、生产投资规模扩张过快，流动资金配套跟不上需求
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers5.q5_b"
						:disabled="inputDisabled"
					>
						B、原材料涨价过快，自身产品难以随之上调价格，利润空间受到挤压
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers5.q5_c"
						:disabled="inputDisabled"
					>
						C、人民币升值压力加大
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers5.q5_d"
						:disabled="inputDisabled"
					>
						D、出口退税率降低
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers5.q5_e"
						:disabled="inputDisabled"
					>
						E、劳动力成本上升
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers5.q5_f"
						:disabled="inputDisabled"
					>
						F、难以从外部渠道融资（包括银行和民间融资）
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers5.q5_g"
						:disabled="inputDisabled"
					>
						G、产品销售渠道不畅，产成品和应收货款占用上升
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers5.q5_h"
						:disabled="inputDisabled"
					>
						H、企业管理不善，效益不好，资金周转不灵
					</van-checkbox>
				</div>
			</div>
			<div class="question-item" v-if="answers4.q4 !== 'F'">
				<div class="question-item-title">
					<span class="question-index">06.</span
					><span class="question-tip">【多选】</span>企业目前融资的主要形式:
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers6.q6_a"
						:disabled="inputDisabled"
					>
						A、银行贷款
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers6.q6_b"
						:disabled="inputDisabled"
					>
						B、票据
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers6.q6_c"
						:disabled="inputDisabled"
					>
						C、股权融资
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers6.q6_d"
						:disabled="inputDisabled"
					>
						D、债权融资
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers6.q6_e"
						:disabled="inputDisabled"
					>
						E、挂牌上市
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers6.q6_f"
						:disabled="inputDisabled"
					>
						F、内部集资
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers6.q6_g"
						:disabled="inputDisabled"
					>
						G、民间借贷
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers6.q6_h"
						:disabled="inputDisabled"
					>
						H、其他
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers6.q6_i"
						:disabled="inputDisabled"
					>
						I、目前无融资
					</van-checkbox>
				</div>
			</div>
			<div class="question-item" v-if="answers4.q4 !== 'F'">
				<div class="question-item-title">
					<span class="question-index">07.</span
					><span class="question-tip">【多选】</span>企业的贷款资金主要用于以下哪些方面:
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers7.q7_a"
						:disabled="inputDisabled"
					>
						A、扩大生产规模
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers7.q7_b"
						:disabled="inputDisabled"
					>
						B、技术研发改造
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers7.q7_c"
						:disabled="inputDisabled"
					>
						C、解决流动资金不足
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers7.q7_d"
						:disabled="inputDisabled"
					>
						D、归还拖欠货款
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers7.q7_e"
						:disabled="inputDisabled"
					>
						E、进出口资金需要
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers7.q7_f"
						:disabled="inputDisabled"
					>
						F、营销推广
					</van-checkbox>
				</div>
				<div class="question-ans">
					<van-checkbox
						icon-size="16px"
						shape="square"
						v-model="answers7.q7_g"
						:disabled="inputDisabled"
					>
						G、其他
					</van-checkbox>
				</div>
			</div>
			<div class="question-item" v-if="answers4.q4 !== 'F'">
				<div class="question-item-title">
					<span class="question-index">08.</span
					><span class="question-tip">【单选】</span>企业可提供的融资担保方式:
				</div>
				<van-radio-group v-model="answers8.q8">
					<div class="question-ans">
						<van-radio icon-size="16px" name="A" :disabled="inputDisabled">A、信用贷款</van-radio>
					</div>
					<div class="question-ans">
						<van-radio icon-size="16px" name="B" :disabled="inputDisabled"
							>B、固定资产(房产、车辆、设备等)抵押</van-radio
						>
					</div>
					<div class="question-ans">
						<van-radio icon-size="16px" name="C" :disabled="inputDisabled"
							>C、知识产权质押</van-radio
						>
					</div>
					<div class="question-ans">
						<van-radio icon-size="16px" name="D" :disabled="inputDisabled"
							>D、其他资产质押</van-radio
						>
					</div>
					<div class="question-ans">
						<van-radio icon-size="16px" name="E" :disabled="inputDisabled"
							>E、担保公司担保</van-radio
						>
					</div>
					<div class="question-ans">
						<van-radio icon-size="16px" name="F" :disabled="inputDisabled"
							>F、其他第三方担保</van-radio
						>
					</div>
				</van-radio-group>
			</div>
			<div class="question-item">
				<div class="question-item-title">
					<span>09.</span
					><span class="question-tip">【选填】</span
					>企业对融资方面是否还有其他诉求或建议，如有请在下方填写:
				</div>
				<textarea rows="6" cols="30" v-model="answers9.q9" :readonly="inputDisabled"> </textarea>
			</div>
			<div class="question-item">
				<div class="question-item-title">
					<span class="question-index">10.</span
					><span class="question-tip">【选择】</span>企业对此次客户经理走访情况进行打分评价:
				</div>
				<div class="rate-pf">
					<van-rate
						v-model="answers10.q10"
						:size="40"
						color="#ffd21e"
						void-icon="star"
						void-color="#eee"
						:readonly="inputDisabled"
					/>
				</div>
			</div>
			<div style="height: 100px"></div>
			<div class="submit-btn" v-if="!type">
				<div class="submit-bo" @click="toWhere">提交</div>
			</div>
		</div>
	</Page>
</template>

<script>
	import {
		insertQuestion,
		getLaborRaceQuestionnaireInfo,
		insertCropQuestionForLabor,
	} from '@/interfaces/questionnaire';
	export default {
		name: 'visitForm',
		components: {},
		data() {
			return {
				corpName: '',
				shortName: '',
				corpCredit: '',
				inputDisabled: false,
				// 问卷的答案
				answers1: {
					q1: '',
				},
				answers2: {
					q2: '',
				},
				answers3: {
					q3: '',
				},
				answers4: {
					q4: '',
				},
				answers5: {
					q5_a: '',
					q5_b: '',
					q5_c: '',
					q5_d: '',
					q5_e: '',
					q5_f: '',
					q5_g: '',
					q5_h: '',
				},
				answers6: {
					q6_a: '',
					q6_b: '',
					q6_c: '',
					q6_d: '',
					q6_e: '',
					q6_f: '',
					q6_g: '',
					q6_h: '',
					q6_i: '',
				},
				answers7: {
					q7_a: '',
					q7_b: '',
					q7_c: '',
					q7_d: '',
					q7_e: '',
					q7_f: '',
					q7_g: '',
				},
				answers8: {
					q8: '',
				},
				answers9: {
					q9: '',
				},
				answers10: {
					q10: 0,
				},
				type: '',
			};
		},
		created() {
			this.getDetails();
		},
		methods: {
			async getDetails() {
				this.type = this.getUrlParam('type') || '';
				this.corpName = decodeURIComponent(this.getUrlParam('corpName') || '');
				this.shortName = decodeURIComponent(this.getUrlParam('shortName') || '');
				this.corpCredit = this.getUrlParam('corpCredit') || '';
				this.userId = this.getUrlParam('userId') || '';
				if (this.type == '1') {
					console.log('111');
					this.inputDisabled = true;
					const params = {
						//   rzId: this.getUrlParam("id") || "",
						rzId: this.corpCredit || '',
						userId: this.userId
					};
					console.log(this.corpCredit, 'paramsparams');
					const res = await getLaborRaceQuestionnaireInfo(params);
					console.log(res, 'res');
					// 数据反显
					Object.keys(this.answers1).forEach((pre) => {
						this.answers1[pre] = res.data[pre];
					});
					Object.keys(this.answers2).forEach((pre) => {
						this.answers2[pre] = res.data[pre];
					});
					Object.keys(this.answers3).forEach((pre) => {
						this.answers3[pre] = res.data[pre];
					});
					Object.keys(this.answers4).forEach((pre) => {
						this.answers4[pre] = res.data[pre];
					});
					Object.keys(this.answers5).forEach((pre) => {
						this.answers5[pre] = res.data[pre] === 'true' ? true : false;
					});
					Object.keys(this.answers6).forEach((pre) => {
						this.answers6[pre] = res.data[pre] === 'true' ? true : false;
					});
					Object.keys(this.answers7).forEach((pre) => {
						this.answers7[pre] = res.data[pre] === 'true' ? true : false;
					});
					Object.keys(this.answers8).forEach((pre) => {
						this.answers8[pre] = res.data[pre];
					});
					Object.keys(this.answers9).forEach((pre) => {
						this.answers9[pre] = res.data[pre];
					});
					Object.keys(this.answers10).forEach((pre) => {
						this.answers10[pre] = +res.data[pre];
					});
					// Object.keys(this.answers_xt).forEach((pre) => {
					//   this.answers_xt[pre] = res.data[pre];
					// });
				} else {
					console.log('2222');
					this.inputDisabled = false;
				}
			},
			verify() {
				if (this.answers4.q4 === 'F') {
					if (
						!Object.values(this.answers1).some((val) => val) ||
						!Object.values(this.answers2).some((val) => val) ||
						!Object.values(this.answers4).some((val) => val) ||
						!Object.values(this.answers10).some((val) => val)
					) {
						return true;
					} else {
						return false;
					}
				} else {
					if (
						!Object.values(this.answers1).some((val) => val) ||
						!Object.values(this.answers2).some((val) => val) ||
						!Object.values(this.answers4).some((val) => val) ||
						!Object.values(this.answers5).some((val) => val) ||
						!Object.values(this.answers6).some((val) => val) ||
						!Object.values(this.answers7).some((val) => val) ||
						!Object.values(this.answers8).some((val) => val) ||
						!Object.values(this.answers10).some((val) => val)
					) {
						return true;
					} else {
						return false;
					}
				}
			},
			async goSub1() {
				if (this.verify()) {
					this.$toast('请填写问卷后提交');
				} else {
					// 如果多选为false改为‘’
					//   this.answers5.q5_a=this.answers5.q5_a==true?this.answers5.q5_a:''
					//   this.answers5.q5_b=this.answers5.q5_b==true?this.answers5.q5_b:''
					//   this.answers5.q5_c=this.answers5.q5_c==true?this.answers5.q5_c:''
					//   this.answers5.q5_d=this.answers5.q5_d==true?this.answers5.q5_d:''
					//   this.answers5.q5_e=this.answers5.q5_e==true?this.answers5.q5_e:''
					//   this.answers5.q5_f=this.answers5.q5_f==true?this.answers5.q5_f:''
					//   this.answers5.q5_g=this.answers5.q5_g==true?this.answers5.q5_g:''
					//   this.answers5.q5_h=this.answers5.q5_h==true?this.answers5.q5_h:''
					//  //
					//   this.answers6.q6_a=this.answers6.q6_a==true?this.answers6.q6_a:''
					//   this.answers6.q6_b=this.answers6.q6_b==true?this.answers6.q6_b:''
					//   this.answers6.q6_c=this.answers6.q6_c==true?this.answers6.q6_c:''
					//   this.answers6.q6_d=this.answers6.q6_d==true?this.answers6.q6_d:''
					//   this.answers6.q6_e=this.answers6.q6_e==true?this.answers6.q6_e:''
					//   this.answers6.q6_f=this.answers6.q6_f==true?this.answers6.q6_f:''
					//   this.answers6.q6_g=this.answers6.q6_g==true?this.answers6.q6_g:''
					//   this.answers6.q6_h=this.answers6.q6_h==true?this.answers6.q6_h:''
					//   this.answers6.q6_i=this.answers6.q6_i==true?this.answers6.q6_i:''
					//  //
					//   this.answers7.q7_a=this.answers7.q7_a==true?this.answers7.q7_a:''
					//   this.answers7.q7_b=this.answers7.q7_b==true?this.answers7.q7_b:''
					//   this.answers7.q7_c=this.answers7.q7_c==true?this.answers7.q7_c:''
					//   this.answers7.q7_d=this.answers7.q7_d==true?this.answers7.q7_d:''
					//   this.answers7.q7_e=this.answers7.q7_e==true?this.answers7.q7_e:''
					//   this.answers7.q7_f=this.answers7.q7_f==true?this.answers7.q7_f:''
					//   this.answers7.q7_g=this.answers7.q7_g==true?this.answers7.q7_g:''
					// ===========================
					const qsInfo =
						this.answers4.q4 === 'F'
							? {
									...this.answers1,
									...this.answers2,
									...this.answers3,
									q5_a: '',
									q5_b: '',
									q5_c: '',
									q5_d: '',
									q5_e: '',
									q5_f: '',
									q5_g: '',
									q5_h: '',
									q6_a: '',
									q6_b: '',
									q6_c: '',
									q6_d: '',
									q6_e: '',
									q6_f: '',
									q6_g: '',
									q6_h: '',
									q6_i: '',
									q7_a: '',
									q7_b: '',
									q7_c: '',
									q7_d: '',
									q7_e: '',
									q7_f: '',
									q7_g: '',
									q8: '',
									...this.answers9,
									...this.answers10,
							  }
							: {
									...this.answers1,
									...this.answers2,
									...this.answers3,
									...this.answers4,
									...this.answers5,
									...this.answers6,
									...this.answers7,
									...this.answers8,
									...this.answers9,
									...this.answers10,
							  };
					const laborFlag = this.getUrlParam('laborFlag') || '';
					const params = {
						rzId: this.corpCredit,
						qsName: laborFlag === '竞赛' ? '科技竞赛' : '走访问卷I',
						userId: this.userId,
						qsInfo: qsInfo,
					};
					const res = await insertQuestion(params);
					console.log(res, 'res');
					if (res.code == 200) {
						this.$toast.success('您的问卷已提交成功');
					} else {
						this.$toast('请勿重复提交');
					}
				}
			},
			async goSub2() {
				if (this.verify()) {
					this.$toast('请填写问卷后提交');
				} else {
					// 如果多选为false改为‘’
					//   this.answers5.q5_a=this.answers5.q5_a==true?this.answers5.q5_a:''
					//   this.answers5.q5_b=this.answers5.q5_b==true?this.answers5.q5_b:''
					//   this.answers5.q5_c=this.answers5.q5_c==true?this.answers5.q5_c:''
					//   this.answers5.q5_d=this.answers5.q5_d==true?this.answers5.q5_d:''
					//   this.answers5.q5_e=this.answers5.q5_e==true?this.answers5.q5_e:''
					//   this.answers5.q5_f=this.answers5.q5_f==true?this.answers5.q5_f:''
					//   this.answers5.q5_g=this.answers5.q5_g==true?this.answers5.q5_g:''
					//   this.answers5.q5_h=this.answers5.q5_h==true?this.answers5.q5_h:''
					//  //
					//   this.answers6.q6_a=this.answers6.q6_a==true?this.answers6.q6_a:''
					//   this.answers6.q6_b=this.answers6.q6_b==true?this.answers6.q6_b:''
					//   this.answers6.q6_c=this.answers6.q6_c==true?this.answers6.q6_c:''
					//   this.answers6.q6_d=this.answers6.q6_d==true?this.answers6.q6_d:''
					//   this.answers6.q6_e=this.answers6.q6_e==true?this.answers6.q6_e:''
					//   this.answers6.q6_f=this.answers6.q6_f==true?this.answers6.q6_f:''
					//   this.answers6.q6_g=this.answers6.q6_g==true?this.answers6.q6_g:''
					//   this.answers6.q6_h=this.answers6.q6_h==true?this.answers6.q6_h:''
					//   this.answers6.q6_i=this.answers6.q6_i==true?this.answers6.q6_i:''
					//  //
					//   this.answers7.q7_a=this.answers7.q7_a==true?this.answers7.q7_a:''
					//   this.answers7.q7_b=this.answers7.q7_b==true?this.answers7.q7_b:''
					//   this.answers7.q7_c=this.answers7.q7_c==true?this.answers7.q7_c:''
					//   this.answers7.q7_d=this.answers7.q7_d==true?this.answers7.q7_d:''
					//   this.answers7.q7_e=this.answers7.q7_e==true?this.answers7.q7_e:''
					//   this.answers7.q7_f=this.answers7.q7_f==true?this.answers7.q7_f:''
					//   this.answers7.q7_g=this.answers7.q7_g==true?this.answers7.q7_g:''
					// ===========================
					const qsInfo =
						this.answers4.q4 === 'F'
							? {
									...this.answers1,
									...this.answers2,
									...this.answers3,
									q5_a: '',
									q5_b: '',
									q5_c: '',
									q5_d: '',
									q5_e: '',
									q5_f: '',
									q5_g: '',
									q5_h: '',
									q6_a: '',
									q6_b: '',
									q6_c: '',
									q6_d: '',
									q6_e: '',
									q6_f: '',
									q6_g: '',
									q6_h: '',
									q6_i: '',
									q7_a: '',
									q7_b: '',
									q7_c: '',
									q7_d: '',
									q7_e: '',
									q7_f: '',
									q7_g: '',
									q8: '',
									...this.answers9,
									...this.answers10,
							  }
							: {
									...this.answers1,
									...this.answers2,
									...this.answers3,
									...this.answers4,
									...this.answers5,
									...this.answers6,
									...this.answers7,
									...this.answers8,
									...this.answers9,
									...this.answers10,
							  };
					const laborFlag = this.getUrlParam('laborFlag') || '';
					const params = {
						rzId: this.corpCredit,
						qsName: laborFlag === '竞赛' ? '科技竞赛' : '走访问卷I',
						userId: this.userId,
						qsInfo: qsInfo,
					};
					console.log(params, 'paramsparamsparams');
					const res = await insertCropQuestionForLabor(params);
					console.log(res, 'res');
					if (res.code == 200) {
						this.$toast.success('您的问卷已提交成功');
					} else {
						this.$toast('请勿重复提交');
					}
				}
			},
			toWhere() {
				const laborFlag = this.getUrlParam('laborFlag') || '';
				if (laborFlag) {
					// 科技竞赛
					this.goSub2();
				} else {
					this.goSub1();
				}
			},
			getUrlParam(name) {
				const queryStr = String(window.location).split('?')[1] || '';
				name = encodeURIComponent(name);
				let arr = new RegExp('(^|&)' + name + '=([^&]*)(&|$)').exec(queryStr);
				if (arr) {
					return decodeURIComponent(RegExp.$2);
				} else {
					return '';
				}
			},
		},
	};
</script>

<style lang="scss" scoped>
	@import '@/assets/css/demo/index.scss';
	.visit-form {
		height: 100%;
		overflow-y: auto;
		background: #f6f6f6;
	}
	.question {
		width: 100vw;
		height: 268px;
		background-color: #e3eeff;
		position: relative;
		background-image: url('~img/questionnaire/bac-top.png');
		background-repeat: repeat-x;
		background-size: 100% auto;
		padding: 13px;
		padding-bottom: 50px;
		// overflow-y: auto;
	}
	.question-body-btn {
		margin: 40px;
		height: 79px;
		background: #4b91e7;
		border-radius: 3px;
		font-size: 16px;
		font-family: Alibaba PuHuiTi;
		font-weight: 400;
		color: #ffffff;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.question-title {
		height: 89px;
		// border: 1px solid red;
		.visit-top-title1 {
			margin: 0px 0 0 8px;
			width: 119px;
			height: 28px;
		}
		.visit-top-title2 {
			margin: 6px 0 0 8px;
			font-size: 13px;
			font-family: Alibaba PuHuiTi;
			font-weight: 400;
			color: #000000;
		}
	}
	.qs-company {
		margin-top: 0px;
		height: 73px;
		background-image: url('~img/questionnaire/bac-company.png');
		background-repeat: repeat-x;
		background-size: 100% auto;
		display: flex;
		align-items: center;
		padding-left: 15px;
		.oneline_left {
			display: flex;
			justify-content: center;
			align-items: center;
			width: 36px;
			height: 36px;
			border-radius: 5px;
			background-color: #3282e4;
			font-size: 12px;
			// font-family: Source Han Sans SC;
			color: #ffffff;
			margin-right: 7px;
			p {
				margin: 2px;
				text-align: center;
			}
		}
		.title-com {
			font-size: 15px;
			font-family: Alibaba PuHuiTi;
			font-weight: 400;
			color: #000000;
		}
		.title-cre {
			font-size: 12px;
			font-family: Alibaba PuHuiTi;
			font-weight: 400;
			color: #5f6269;
		}
	}

	/* 问卷内容 */
	.question-item {
		background: #ffffff;
		box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.06);
		border-radius: 9px;
		padding: 18px;
		margin-top: 16px;
		/* flex-wrap: wrap; */
		.question-index {
			position: relative;
			&::before {
				content: '*';
				position: absolute;
				left: -8px;
				top: 2px;
				color: #e3705d;
			}
		}
		.question-tip {
			color: #186ff5;
		}
	}
	.question-item-title {
		/* height: 50px; */
		// display: flex;
		// align-items: center;
		// flex-wrap: wrap;
		font-size: 15px;
		font-family: Helvetica Neue;
		font-weight: 500;
		color: #000000;
	}
	.question-ans {
		font-size: 14px;
		font-weight: 400;
		color: #777777 !important;
		/* display: flex;
	flex-direction: column;
	justify-content: space-between; */
		margin-top: 14px;
		display: flex;
		align-items: center !important;
		/* border: 1px solid red; */
		/deep/.van-radio__label {
			color: #777777 !important;
		}
	}

	/deep/.van-checkbox__label {
		color: #777777 !important;
	}
	.question-num {
		width: 68px;
		height: 24px;
		background: #ffffff;
		border: 1px solid #e0e1e5 !important;
		border-radius: 2px;
		margin: 0 8px;
		font-size: 13px;
		font-weight: 400;
		padding: 0 8px;
	}
	.question-item-title1 {
		font-size: 15px;
		font-weight: 400;
		color: #2c2c2c;
		/* display: flex;
	align-items: center; */
		/* flex-wrap: wrap; */
	}
	.question-num1 {
		width: 50px;
		height: 20px;
		background: #ffffff;
		border: 1px solid #e0e1e5 !important;
		border-radius: 2px;
		margin: 0 8px;
		margin-top: 6px;
		font-size: 13px;
		font-weight: 400;
		color: #777777;
		padding: 0 8px;
		display: inline-table;
	}
	.question-item-title2 {
		margin-top: 10px;
		font-size: 12px;
		font-family: Alibaba PuHuiTi;
		font-weight: 400;
		color: #777777;
	}
	.submit-btn {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		height: 60px;
		background: #f6f6f6;
		border-radius: 3px;
		font-size: 16px;
		font-family: Alibaba PuHuiTi;
		font-weight: 400;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.submit-bo {
		background: #356ded;
		height: 44px;
		width: calc(100% - 40px);
		color: #ffffff;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 30px;
	}
	.rate-pf {
		margin-top: 12px;
		display: flex;
		justify-content: center;
	}
	input {
		margin-top: 10px;
		height: 35px;
		width: 100%;
		-webkit-appearance: none;
		border: 1px solid rgb(238, 232, 232);
		padding: 2px;
		padding-left: 10px;
	}
	textarea {
		margin-top: 10px;
		width: 100%;
		-webkit-appearance: none;
		border: 1px solid rgb(238, 232, 232);
		padding: 2px;
	}
	/deep/ .van-checkbox__icon .van-icon {
		border-radius: 4px;
	}
	/deep/ .van-radio__icon--round .van-icon {
		border-radius: 4px;
	}
	/deep/ .van-rate__item:not(:last-child) {
		padding-right: 15px;
	}
</style>
